    var map;
    var infoWindow = new google.maps.InfoWindow();
    var geocoder;  
    var indonesia_position = new google.maps.LatLng( -2.2167967277627585, 120.84651947021484);
    var marker_pencari;
    var markers_hasil = [];
    var window_hasil = [];
    var base_url = 'http://10.151.34.35/share/';
    var site_url = 'http://10.151.34.35/share/';
    var input;
    var autocomplete;
    var mc;
    
    var poly;
    var path = new google.maps.MVCArray;
    var map2;
    
    var infoBubbletes= [] ;
    
var bud =0;
function budaya()
{
    close_profil();
    beranda_close();
    if(bud==0){   
        $('.icon1').addClass("ico1").removeClass('icon1').addClass('ico1');bud=1;
        document.getElementById('k_budaya').value = 1;
    }
    else if (bud==1){
        $('.ico1').addClass("icon1").removeClass('ico1').addClass('icon1');bud=0;
        document.getElementById('k_budaya').value = 0;
    }
    ajax_mapresult();
    closeAllInfoBuble();
}

var rek =0;
function rekreasi()
{
    close_profil();
    beranda_close();
    if(rek==0){   
        $('.icon2').addClass("ico2").removeClass('icon2').addClass('ico2');rek=1;
        document.getElementById('k_rekreasi').value = 1;
    }
    else if (rek==1){
        $('.ico2').addClass("icon2").removeClass('ico2').addClass('icon2');rek=0;
        document.getElementById('k_rekreasi').value = 0;
    }
    ajax_mapresult();
    closeAllInfoBuble();
}

var h =0;
function hiburan()
{
    close_profil();
    beranda_close();
    if(h==0){   
        $('.icon3').addClass("ico3").removeClass('icon3').addClass('ico3');h=1;
        document.getElementById('k_hiburan').value = 1;
    }
    else if (h==1){
        $('.ico3').addClass("icon3").removeClass('ico3').addClass('icon3');h=0;
        document.getElementById('k_hiburan').value = 0;
    }
    ajax_mapresult();
    closeAllInfoBuble();
}

var ijo =0;
function hijau()
{
    close_profil();
    beranda_close();
    if(ijo==0){   
        $('.icon4').addClass("ico4").removeClass('icon4').addClass('ico4');ijo=1;
        document.getElementById('k_hijau').value = 1;
    }
    else if (ijo==1){
        $('.ico4').addClass("icon4").removeClass('ico4').addClass('icon4');ijo=0;
        document.getElementById('k_hijau').value = 0;
    }
    ajax_mapresult();
    closeAllInfoBuble();
}

var l =0;
function lindung()
{
    close_profil();
    beranda_close();    
    if(l==0){   
        $('.icon5').addClass("ico5").removeClass('icon5').addClass('ico5');l=1;
        document.getElementById('k_lindung').value = 1;
    }
    else if (l==1){
        $('.ico5').addClass("icon5").removeClass('ico5').addClass('icon5');l=0;
        document.getElementById('k_lindung').value = 0;
    }
     ajax_mapresult();
     closeAllInfoBuble();
}

var k =0;
function konservasi()
{
    close_profil();
    beranda_close();
    if(k==0){   
        $('.icon6').addClass("ico6").removeClass('icon6').addClass('ico6');k=1;
        document.getElementById('k_konservasi').value = 1;
    }
    else if (k==1){
        $('.ico6').addClass("icon6").removeClass('ico6').addClass('icon6');k=0;
        document.getElementById('k_konservasi').value = 0;
    }
     ajax_mapresult();
     closeAllInfoBuble();
}

var bn =0;
function bencana()
{
    close_profil();
    beranda_close();
    if(bn==0){   
        $('.icon7').addClass("ico7").removeClass('icon7').addClass('ico7');bn=1;
        document.getElementById('k_bencana').value = 1;
        
    }
    else if (bn==1){
        $('.ico7').addClass("icon7").removeClass('ico7').addClass('icon7');bn=0;
        document.getElementById('k_bencana').value = 0;
    }
    ajax_mapresult();
    closeAllInfoBuble();
}

var p =0;
function pasar()
{
    close_profil();
    beranda_close();
    if(p==0){   
        $('.icon8').addClass("ico8").removeClass('icon8').addClass('ico8');p=1;
        document.getElementById('k_pasar').value = 1;
    }
    else if (p==1){
        $('.ico8').addClass("icon8").removeClass('ico8').addClass('icon8');p=0;
        document.getElementById('k_pasar').value = 0;
    }
    ajax_mapresult();
    closeAllInfoBuble();
} 
  
  function initialize() {
    base_url = document.getElementById('txtBaseUrl').value;
    site_url = base_url;
    beranda_open();
    var myOptions = {
            zoom: 4,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            center: indonesia_position,
            panControl: false,//ngilangin control pan
            zoomControl: false,
            zoomControlOptions: {
            style: google.maps.ZoomControlStyle.SMALL,
            position: google.maps.ControlPosition.TOP_CENTER},
            mapTypeControl: false,
            mapTypeControlOptions: {
            position: google.maps.ControlPosition.BOTTOM_CENTER,
            style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
            scaleControl: false //ngilangin control scale
        };
        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
        
        // Autocomplete 
        input = document.getElementById("address");
        autocomplete = new google.maps.places.Autocomplete(input);
        autocomplete.bindTo('bounds', map);
        google.maps.event.addListener(autocomplete, 'place_changed',autocompleting);
        
        mc = new MarkerClusterer(map,markers_hasil);
        google.maps.event.addListener(map, 'bounds_changed', function() {
             getalamat();
             ajax_mapresult();
        });

        geocoder = new google.maps.Geocoder();
    
        google.maps.event.addListener(map, 'dragend', function() {getalamat();} );
        google.maps.event.addListener(map, 'zoom_changed', function() {getalamat();} );
  }
  


function ajax_mapresult(){
          $.ajax({
            type: "POST",
            url: $("#search_by_map").attr('action'),
            data: $("#search_by_map").serialize(),
            dataType: 'json',
            success: function(json) {
                    mc.resetViewport();
                    clearOverlaysmarker();//hapus dari map
                    markers_hasil = [];//set 0 again
                    if (json.Locations.length > 0) {
                            for (i=0; i<json.Locations.length; i++) {
                                    var location = json.Locations[i];
                                    var imgg=json.potonya.toString();
                                    //alert(json.Category[i]);
                                    var kat = '1';
                                    addMarker_hasil(map, location,kat, imgg);
                            }
                            var res = json.resultnya.toString();
                            $("div#ajax_result").html(res);
                            mc.redraw();
                    }
                    
            }
        });
        return false; 
}

function close_profil()
{
    $(".profil_area").animate({
              "top": "-70%"
            }, "slow");
    $(".search-box1").animate({
              opacity:1
        }, "fast");
    
}

function beranda_open()
{
    $(".beranda").animate({
              "top": "90px"
            }, "slow");
    $(".search-box1").animate({
              opacity:0
        }, "fast");
    $('.m_beranda').addClass("m_beranda1").removeClass('m_beranda0').addClass('m_beranda1');
    $('.m_cari').addClass("m_cari0").removeClass('m_cari1').addClass('m_cari0');
}

function beranda_close()
{
    $(".beranda").animate({
              "top": "-70%"
            }, "slow");
    $(".search-box1").animate({
              opacity:1
        }, "fast");
         $('.m_beranda1').addClass("m_beranda0").removeClass('m_beranda1').addClass('m_beranda0');
    $('.m_cari0').addClass("m_cari1").removeClass('m_cari0').addClass('m_cari1');
}


function highlight_area(id)
{
        $(".profil_area").animate({
              "top": "90px"
            }, "slow");
        $(".search-box1").animate({
              opacity:0
        }, "fast");
        
        document.getElementById('txtLocationId').value = id;
        $.ajax({
                type: "POST",
                url: $("#getLocartionInfo").attr('action'),
                data: $("#getLocartionInfo").serialize(),
                dataType: 'json',
                success: function(json) {
                        if (json.Locations.length > 0) 
                        {
                               path.clear();
                               var res = json.resultnya.toString();
                               $("div#ajax_result_profil").html(res);
                               var location = json.Locations[0];
                               var myOptions2 = {
                                    mapTypeId: google.maps.MapTypeId.ROADMAP,
                                    zoom: 5,
                                    center: indonesia_position,
                                    panControl: false,//ngilangin control pan
                                    zoomControl: false,
                                    mapTypeControl: false,
                                    scaleControl: false //ngilangin control scale
                                };
                               var point = new google.maps.LatLng(location.LOCATION_LAT, location.LOCATION_LNG);;
                                map2 = new google.maps.Map(document.getElementById("map_canvas2"), myOptions2);
                                poly = new google.maps.Polygon({
                                strokeWeight: 3,
                                fillColor: '#5555FF'
                                });
                                poly.setMap(map2);
                                poly.setPaths(new google.maps.MVCArray([path]));
                               map2.setCenter(point);
                               
                               var col = "#".concat(location.LOCATION_POLY_COL.toString());
                               poly.setOptions({fillColor:col});
                               
                               var polylng = location.LOCATION_POLY_LNG.toString();
                               var polylat = location.LOCATION_POLY_LAT.toString();
                               var polyjum = parseInt(location.LOCATION_POLY_JUM);
                               var lngarr = polylng.split(' ');
                               var latarr = polylat.split(' ');
                               var minLat = 1000;
                               var minLng = 1000;
                               var maxLat = -1000;
                               var maxLng = -1000;
                               for(var i=0;i < polyjum;i++)
                               {
                                    boundlat = parseFloat(latarr[i]);
                                    boundlng = parseFloat(lngarr[i]);
                                    var point2 = new google.maps.LatLng(boundlat, boundlng);
                                    maxLat = Math.max(maxLat,boundlat);
                                    maxLng = Math.max(maxLng,boundlng);
                                    minLng = Math.min(minLng,boundlng);
                                    minLat = Math.min(minLat,boundlat);
                                    path.insertAt(path.length, point2);
                               }
                               var sw = new google.maps.LatLng(minLat, minLng);
                               var ne = new google.maps.LatLng(maxLat, maxLng);
                               
                               var bounds = new google.maps.LatLngBounds(sw,ne);
                               map2.fitBounds(bounds);
                        }
                }
            });
    }

    var a=-1;
    function addMarker_hasil(map, location,kat,imgg){
            //alert(location.CAT1);
            //alert(imgg);
            var marker_gbr;
            if(location.CAT1 == 1 || bud==1 ) marker_gbr = 1 ;
            if(location.CAT2 == 1 || rek == 1  ) marker_gbr = 2 ;
            if(location.CAT3 == 1 || h == 1 ) marker_gbr = 3 ;
            if(location.CAT4 == 1 || ijo == 1 ) marker_gbr = 4 ;
            if(location.CAT5 == 1 || l == 1 ) marker_gbr = 5 ;
            if(location.CAT6 == 1 || k == 1 ) marker_gbr = 6 ;
            if(location.CAT7 == 1 || bn == 1 ) marker_gbr = 7 ;
            if(location.CAT8 == 1 || p == 1 ) marker_gbr = 8 ;
            
            /*if(bud == 1) marker_gbr = 1 ;
            if(rek == 1) marker_gbr = 2 ;
            if(h == 1) marker_gbr = 3 ;
            if(ijo == 1) marker_gbr = 4 ;
            if(l == 1) marker_gbr = 5 ;
            if(k == 1) marker_gbr = 6 ;
            if(bn == 1) marker_gbr = 7 ;
            if(p == 1) marker_gbr = 8 ;*/
            
            
            
            var i = markers_hasil.length;
            var p;
            var point = new google.maps.LatLng(location.LOCATION_LAT, location.LOCATION_LNG);
            var marker = new google.maps.Marker({
                    position: point,
                    clickable: true,
                    draggable: false,
                    icon : base_url.concat("file/image/marker/marker"+marker_gbr+".png"),
                    title : location.location_map
            });
            
            google.maps.event.addListener(marker, "click", function() {
                    var z = map.getZoom();
                    /*if (a>0) infoBubbletes[a].close();
                    var infoo = location.LOCATION_NAME+"<br\>";
                    var info2 = "<div id=\"map_popup\" name=\"map_popup\" style=\"width: 100px; height: 100px;\">";
                    +"tes"+ "</div>";
                    //var info2 = location.LOCATION_POLY_LAT+"<br\>"+location.LOCATION_POLY_LNG;
                    infoBubbletes[location.LOCATION_ID] = new InfoBubble({
                          map: map,
                          shadowStyle: 0,
                          padding: 10,
                          backgroundColor: '#0e74ca',
                          borderRadius: 5,
                          minWidth:200,
                          maxHeight:200,
                          minHeight:140,
                          maxWidth:400,
                          arrowSize: 20,
                          borderWidth: 1,
                          arrowPosition: 50,
                          backgroundClassName: 'window',
                          arrowStyle: 0
                    });
                    
                    infoBubbletes[location.LOCATION_ID].setContent(infoo+"<br\>"+info2);
                    infoBubbletes[location.LOCATION_ID].setPosition(point);
                    if (!infoBubbletes[location.LOCATION_ID].isOpen()) {
                        infoBubbletes[location.LOCATION_ID].open(map, marker);
                    }
                    a = location.LOCATION_ID;*/
                    map.setZoom(z);
                    highlight_area(location.LOCATION_ID);
                    //infoWindow.setContent(infoo);
                    //infoWindow.setPosition(point);
                    //infoWindow.open(map);
                   /* var myOptions = {
                                        zoom: 4,
                                        center: indonesia_position,
                                        mapTypeId: google.maps.MapTypeId.ROADMAP,
                                        panControl: false,//ngilangin control pan
                                        zoomControl: false,
                                        mapTypeControl: false,
                                        scaleControl: false //ngilangin control scale
                                    };
                    
                    map_popup = new google.maps.Map(document.getElementById("map_popup"), myOptions);
                    poly2 = new google.maps.Polygon({
                    strokeWeight: 3,
                    fillColor: '#5555FF'
                    });
                    poly2.setMap(map_popup);
                    poly2.setPaths(new google.maps.MVCArray([path2]));
                    draw_polygon_area(location);*/
            });
            
            markers_hasil.push(marker);
            mc.addMarker(marker,true);
    }
    
    /*function draw_polygon_area(location)
    {
           path2.clear();
           var point = new google.maps.LatLng(location.LOCATION_LAT, location.LOCATION_LNG);
           map_popup.setCenter(point);
           var col = "#".location.LOCATION_POLY_COL;
           poly2.setOptions({fillColor:col});
           var polylat = location.LOCATION_POLY_LAT;
           var polylng = location.LOCATION_POLY_LNG;
           var polyjum = location.LOCATION_POLY_JUM;

           var lngarr = polylng.split(' ');
           var latarr = polylat.split(' ');
           var minLat = 1000.0;
           var minLng = 1000.0;
           var maxLat = -1000.0;
           var maxLng = -1000.0;
           for(var i =0;i < polyjum;i++)
           {
                boundlat = parseFloat(latarr[i]);
                boundlng = parseFloat(lngarr[i]);
                var point2 = new google.maps.LatLng(boundlat, boundlng);
                maxLat = Math.max(maxLat,boundlat);
                maxLng = Math.max(maxLng,boundlng);
                minLng = Math.min(minLng,boundlng);
                minLat = Math.min(minLat,boundlat);
                path2.insertAt(path2.length, point2);
           }
           var sw = new google.maps.LatLng(minLat, minLng);
           var ne = new google.maps.LatLng(maxLat, maxLng);

           var bounds = new google.maps.LatLngBounds(sw,ne);
           map_popup.fitBounds(bounds);
    }*/
    
    function info_area(id){
                
    }
        
    function clearOverlaysmarker() {
            if (markers_hasil) {
                    for (i in markers_hasil) {
                            markers_hasil[i].setMap(null);
                            markers_hasil[i].setVisible(false);
                    }
            }
            
    }

    function closeAllInfoBuble(){
    if (infoBubbletes) {
        for (i in infoBubbletes) {
            infoBubbletes[i].setMap(null);
            infoBubbletes[i].setVisible(false);
        }
    }
}
  
  function getalamat()//
  {

            var newLat = map.getCenter().lat().toString();
            var newLng = map.getCenter().lng().toString();
            codeLatLng(newLat,newLng);

            var lat1 = map.getBounds().getNorthEast().lat();
            var lng1 = map.getBounds().getNorthEast().lng();
            
            var lat2 = map.getBounds().getSouthWest().lat();
            var lng2 = map.getBounds().getSouthWest().lng();
            
            document.getElementById('lat').value = newLat;
            document.getElementById('lng').value = newLng;
            
            document.getElementById('lat1').value = lat1;
            document.getElementById('lng1').value = lng1;
            document.getElementById('lat2').value = lat2;
            document.getElementById('lng2').value = lng2;
                      
  }
  

  
 function codeLatLng(lat1, lng1) {
            var geo = new google.maps.Geocoder();
            var latlng = new google.maps.LatLng(lat1, lng1);
            
            geo.geocode({'latLng': latlng}, function(results, status) {
                    if (status == google.maps.GeocoderStatus.OK) {
                            if (results[0]) {
                                    document.getElementById("geocode_address").value = results[0].formatted_address;
                            }
                    } else {
                            return ("Geocoder failed due to: " + status);
                    }
            });
    }
    
function geocode() {//fungsi cari alamat
            var address = document.getElementById("address").value;
            geocoder.geocode({
            'address': address,
            'partialmatch': true}, geocodeResult);
  }

function geocodeResult(results, status) {//result dari address
        if (status == 'OK' && results.length > 0) {
                map.fitBounds(results[0].geometry.viewport);
                marker_pencari.setPosition(map.getCenter());
                marker_pencari.setAnimation(google.maps.Animation.DROP);
                //getalamat();
                //ajax_mapresult();
        } else {
                alert("Geocode was not successful for the following reason: " + status);
        }
 }

 
 // Fungsi auto complete
function autocompleting()
{
    // Returns the details of the Place selected by the user, or null if no Place has been selected yet. 
    // return = PlaceResult
    var place = autocomplete.getPlace();
    
    // 	Geometry = The Place's geometry-related information.
    // return = PlaceGeometry
    // viewport = The preferred viewport when displaying this Place on a map. This property will be null if the preferred viewport for the Place is not known.
    // return = Latlng
    if (place.geometry.viewport) 
    {
        //Sets the viewport to contain the given bounds.
        map.fitBounds(place.geometry.viewport);
    } 
    else 
    {
        // Set viewport to the Place's position.
        map.setCenter(place.geometry.location);
        map.setZoom(17);  // Why 17? Because it looks good. -_-"
    }

    // Set Marker to center of viewport
    var image = new google.maps.MarkerImage(
      place.icon,
      new google.maps.Size(71, 71),
      new google.maps.Point(0, 0),
      new google.maps.Point(17, 34),
      new google.maps.Size(35, 35));
    //centerMarker.setIcon(image); 
    //centerMarker.setPosition(place.geometry.location);

    //document.getElementById('txtLat').value = centerMarker.getPosition().lat();
    //document.getElementById('txtLng').value = centerMarker.getPosition().lng();
    // The collection of address components for this Place's location.
    var address = '';
    if (place.address_components) {
    address = [(place.address_components[0] &&
                place.address_components[0].short_name || ''),
               (place.address_components[1] &&
                place.address_components[1].short_name || ''),
               (place.address_components[2] &&
                place.address_components[2].short_name || '')
              ].join(' ');
    }
    // Kalo ada gelembung di viewport, maka destory dulu gelembungnya
    //infowindow.close();
    // Buat gelembung baru dengan nama tempat + alamat dari hasil place.address
    //infowindow.setContent('<div><strong>' + place.name + '</strong><br>' + address + '<br>' + centerMarker.getPosition().lat() + ' ' + centerMarker.getPosition().lng());
    // Taruh di map di posisi = centerMarker
    //infowindow.open(map, centerMarker);
}
